<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJS service</title>
    <script src="../bower_components/angular/angular.min.js"></script>
    <script type="text/javascript">
        // angular.module('myapp', [])
        //         .controller('MyController', function($scope, notify) {
        //             $scope.callNotify = function(message) {
        //                 notify(message);
        //             }
        //         })
        //         .factory('notify', ['$window', function(win) {
        //             var messages = [];
        //             return function (message) {
        //                 messages.push(message);
        //                 if (messages.length == 3) {
        //                     win.alert(messages.join("\n"));
        //                     messages = [];
        //                 }
        //             }
        //         }])

        angular.module('myapp',[])
            .factory('notifyMe', ['$window', function(win){
                var msgs = [];
                return function(msg){
                    msgs.push(msg);
                    if(msgs.length == 3){
                        win.alert(msgs.join("\n"));
                        msgs = [];
                    }
                }
            }])
            .controller("myCon", function($scope, notifyMe){
                $scope.sendNotify = function(mmsg){
                    notifyMe(mmsg);
                }
            })
    </script>
</head>
<body ng-app="myapp">
    <div id="simple" ng-controller="myCon">
        <p>Let's try this simple notify service, injected into the controller...</p>
        <input ng-init="mymsg='mymsg'" ng-model="mymsg" />
        <button ng-click="sendNotify(mymsg)">NOTIFY</button>
        <p>(you have to click 3 times to see an alert)</p>
    </div>
</body>
</html>